<template>
  <div class="article">
    <div class="wrapper">
      <h2>{{articleTitle}}</h2>
      <div><strong>时间：{{articlePublishTime}}</strong></div>
      <div><strong>阅读量：{{articleReadTimes}} 点赞数：{{articleThumpUp}}</strong></div>
      <div v-html="articleContent"></div>
    </div>
  </div>
</template>
<script>
export default {
  data(){
    return {
      articleTitle:this.$route.query.title||'',
      articleContent:this.$route.query.content||'',
      articlePublishTime:this.$route.query.time||'',
      articleReadTimes:this.$route.query.readTimes||'',
      articleThumpUp:this.$route.query.thumpUp||'',
    }
  },
  // methods:{
  //   articleFill(){
  //     // 以params方式接收参数：【params方式，类似ajax中的post方式】
  //     // this.articleContent = this.$route.params.content;
  //     // 以query方式接收参数 【query传递数据是通过URL传递的，类似ajax中的get方式】
  //     this.articleContent = this.$route.query.content;
  //   }
  // },
  // created(){
  //   this.articleFill();
  // }
}
</script>
<style scoped lang="scss">
  .article{
    .wrapper{
      h2{
        display: block;
        margin: 1em 5em;
      }
    }
  }
</style>